<#assign ctx=request.contextPath />
<#import '${ctx}/sys/include/table/select.html' as select />
<#import '${ctx}/biz/chart/element/chart_detail.html' as cd/>
<#import '${ctx}/biz/chart/element/metric-select.html' as metric />
<@cd.detail>
<div class="layui-row">
    <form class="layui-form">
        <div class="layui-form-item">
            <label class="layui-form-label">选择数据源</label>
            <div class="layui-input-block"><@select.table name="dsId"
                show="dsName" url="${ctx}/biz/c/p/ds-select-table" />
            </div>
        </div>
        <label>指标设置</label>
        <hr/>
        <@metric.atom />
    </form>
</div>
</@cd.detail>
<script type="text/javascript">
	var chartIndex = 0;
	var chartDefDescript = [];
	var fieldMap = {};
	layui.use(['layer','appJs'],function(){
		var $ = layui.$
		,layer = layui.layer
		,app = layui.appJs;


		window.handleResponse = function(req,dimensionArray,metricArray,data) {
			var chartDefs = extractPath(req);
			fillChartDescript(chartDefs);
			console.log(chartDefDescript);
			console.log(chartDefs)
			var pieData = app.transform(req,data);
			var co = {};
			co.tooltip = {
				showTitle: false
			}
			var chartDef = chartDefs[chartIndex];
			console.log(chartDef);
			console.log(pieData);
			console.log('===============')
			co.data = pieData;
			co.view = [];
			var i = 1;
			var hist = [];
			var r = chartDef.length;
			var startR = 1/r;
			for(var def of chartDef) {
				var viewDef = {};
				viewDef.transform = [];
				var _h = [];
				$.extend(_h,hist);
				(function(key,hist){
					viewDef.transform.push({
						type:'map',
						callback(row){
							var v = '';
							for(var _k of hist) {
								if(v == '') {
									v = row[_k];
								}
								else {
									v = v+':'+row[_k];
								}
							}
							if(v == '') {
								v = row[key];
							}else {
								v = v+':'+row[key];
							}
							row[fieldMap[key].name] = v;
							return row;
						}
					});
				})(def.field,_h);
				(function(k){
					viewDef.transform.push({
						type: 'percent',
					    field: 'doc',
					    dimension: k,
					    as: 'percent'
					});
				})(fieldMap[def.field].name);
				viewDef.transform.push({
					type:'map',
					callback(row){
						console.log(row);
						var val = row.percent;
						val = (val * 100).toFixed(2) + '%';
						row.tooltip = val;
						return row;
					}
				});
				if(i == 1) {
					(function(){
						viewDef.coord={
								type:'theta',
								conf:{
								    radius: startR
								}
							};
					})(startR);

				}else {
					(function(){
						viewDef.coord={
							type:'theta',
							conf:{
								innerRadius: startR*(i-1),
							    radius: startR*i
							}
						};
					})(startR)

				}

				viewDef.geom = {
						type:'intervalStack',
						position:'percent',
						color:fieldMap[def.field].name,
						label:fieldMap[def.field].name,
						tooltip:{
							field:fieldMap[def.field].name+'*tooltip',
							callback:function(item, percent){
								return {
								      name: item,
								      value: percent
								    }
							}
						},
						style:{
						    lineWidth: 1,
						    stroke: '#fff'
						  }
				}
				co.view.push(viewDef);
				hist.push(def.field);
				i++;
			}
			/*
			for(var metric of metricArray) {
				console.log(metric);

				var viewDef = {};
				viewDef.data = data;
				viewDef.geom = {};
                viewDef.geom.type = 'interval';
                viewDef.geom.position = 'field*count';
			}
			*/

			return co;
		}

		function fillChartDescript(chartDefs) {
			chartDefDescript.length=0;
			app.clearJson(fieldMap);
			if(chartDefs) {
				for(var def of chartDefs) {
					var description = [];
					for(var defDetail of def) {
						if(fieldMap[defDetail.field]) {
							description.push(fieldMap[defDetail.field]);
						}else {
							app.async_ajax('get', '${ctx}/biz/data/ds/field/get', {id: defDetail.field}, function (d) {
								if(d.code == 0) {
									var fieldMeta = d.values.data;
									fieldMeta.aggs = defDetail.aggs;
									description.push(fieldMeta);
									fieldMap[defDetail.field] = fieldMeta;
								}
							});
						}
					}
					chartDefDescript.push(description);
				}
			}
		}

		function extractPath(req) {
			var path = [];
			var pathArr = [];
			if(req.dimension && req.dimension.field && req.dimension.type) {
				path.push({field:req.dimension.field,aggs:dimension.type})
			}
			_extractPath(path,pathArr,req.metric);
			return pathArr;
		}
		function _extractPath(path,pathArr,metrics) {
			if(metrics) {
				for(var metric of metrics){
					var p = [];
					$.extend(p,path);
					p.push({field:metric.field,aggs:metric.type});
					if(metric.metric&&metric.metric.length>0) {
						_extractPath(p,pathArr,metric.metric);
					}else {
						pathArr.push(p);
					}
				}
			}
		}

	});
</script>